﻿@{
    var model = Session["HomeViewModel"] as HomeViewModel;
    
    List<SlideViewModel> slides = new List<SlideViewModel>();
    
    //List<ProductViewModel> products = new List<ProductViewModel>();

    Dictionary<String, List<ProductViewModel>> dicProduct = new Dictionary<string, List<ProductViewModel>>();
    
    if(model != null){
        slides = model.Slides;
        //products = model.Products;
        dicProduct = model.DicProducts;
    }
}

<div class="container" style="margin: 0 auto; width: 1150px;">
    <div class="row-fluid">
        <div class="span9">
            <div class="container-fluid" style="padding: 0px;">
                <div class="row-fluid">
                    <div style="margin-left: 208px; margin-top: 5px; width: 677px;">
                        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                            <!-- Indicators -->
                            <ol class="carousel-indicators">
                                <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                                <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                                <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                            </ol>
                            <!-- Wrapper for slides -->
                            <div class="carousel-inner">
                            @foreach (SlideViewModel slide in slides)
                            {
                                if (slide == slides.ElementAt(0))
                                {
                                
                                    <div class="item active">

                                        <img src="data:image/jpg;base64,@(Convert.ToBase64String(slide.Photo))" alt="...">
                                        <div class="carousel-caption">
                                            <h3>
                                                @slide.Title</h3>
                                        </div>

                                    </div>
                                }
                                else
                                {
                                     <div class="item">

                                        <img src="data:image/jpg;base64,@(Convert.ToBase64String(slide.Photo))" alt="...">
                                        <div class="carousel-caption">
                                            <h3>
                                                @slide.Title</h3>
                                        </div>
                                     </div>
                                }


                            }
                            </div>
                            @*<div class="carousel-inner">
                                <div class="item active">
                                    <img src="../../Images/Slide/bootstrap-mdo-sfmoma-01.jpg" alt="...">
                                    <div class="carousel-caption">
                                        <h3>
                                            First Thumbnail label</h3>
                                        <p>
                                            Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi
                                            porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                    </div>
                                </div>
                                <div class="item">
                                    <img src="../../Images/Slide/bootstrap-mdo-sfmoma-02.jpg" alt="">
                                    <div class="carousel-caption">
                                        <h3>
                                            Second Thumbnail label</h3>
                                        <p>
                                            Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi
                                            porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                    </div>
                                </div>
                                <div class="item">
                                    <img src="../../Images/Slide/bootstrap-mdo-sfmoma-03.jpg" alt="">
                                    <div class="carousel-caption">
                                        <h3>
                                            Third Thumbnail label</h3>
                                        <p>
                                            Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi
                                            porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                    </div>
                                </div>
                            </div>*@
                            <!-- Controls -->
                            <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
                                <span class="glyphicon glyphicon-chevron-left"></span></a><a class="right carousel-control"
                                    href="#carousel-example-generic" data-slide="next"><span class="glyphicon glyphicon-chevron-right">
                                    </span></a>
                        </div>
                    </div>
                </div>
                <div class="row-fluid">
                    <div style="width: 883px;">
                        <div class="container-fluid" style="padding: 0px;">
                            <div class="row-fluid">
                                <div class="span12">

                                @foreach (var dic in dicProduct)
                                {
                                    if (dic.Value.Count > 0)
                                    {
                                    <div class="box-product">
                                        <div class="row-fluid bs-callout bs-callout-warning">
                                            <div class="span6">
                                                <h4 style="padding: 3px 15px;">
                                                    @dic.Value.ElementAt(0).ProductName</h4>
                                            </div>
                                            <div class="span6">
                                                <div class="pull-right">
                                                    <div class="span12">
                                                        <div style="padding-top: 4px; padding-right: 7px;">
                                                            <div class="pagination">
                                                                <ul>
                                                                    <li><a href="#"><i class="icon-chevron-left"></i></a></li>
                                                                    <li><a href="#"><i class="icon-chevron-right"></i></a></li>
                                                                </ul>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="container-fluid">
                                            <div class="row-fluid" style="margin-bottom: 10px; margin-top: 10px;">
                                                
                                                @foreach (ProductViewModel item in dic.Value)
                                                {  
                                                 <div class="span4 vertical-line">
                                                    <table width="100%">
                                                        <tr>
                                                            <td align="center">
                                                                <img src="../../Images/Product/gallery3_2256.jpg" style="width: 250px;" />
                                                                <p>
                                                                    <a href="@Url.Action("Details", "Products", new { name = @item.Name.ToSeoUrl(), id = @item.ProductID })">@item.Name</a></p>
                                                                <span class="label label-important">@Html.Raw(item.Price.Value.ToString("#,0 VND"))</span>
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td>
                                                                <hr />
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td align="center">
                                                                <button class="btn btn-small btn-warning">
                                                                    <i class="icon-shopping-cart icon-white"></i>Thêm vào giỏ
                                                                </button>
                                                                <a class="btn btn-small btn-info" href="@Url.Action("Details", "Products", new { name = @item.Name.ToSeoUrl(), id = @item.ProductID })">
                                                                    <i class="icon-list-alt icon-white"></i>Chi tiết
                                                                </a>
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </div>
                                                }
                                            </div>
                                        </div>
                                    </div>
                                    }
                                }
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="span3">
            <div class="pull-right">
                <div style="padding: 5px; position: relative; left: 0px;">
                    <img src="../../Images/Temp/cellphones_htc_m8_300x120_v2._V341714644_.png" style="width: 252px;" /><br />
                    <img src="../../Images/Temp/Galaxy_S5_Launch_roto._V341717809_.png" style="margin-top: 5px;
                        width: 252px;" /><br />
                    <img src="../../Images/Temp/GNO_Gen6_Tablets-v2.1._V355479617_.png" style="margin-top: 5px;
                        width: 252px; border: 1px solid #CCC;" /><br />
                    <img src="../../Images/Temp/Jewelry_SUBS_W_ROTO75._V342051862_.gif" style="margin-top: 5px;
                        width: 252px; border: 1px solid #CCC;" /><br />
                    <img src="../../Images/Temp/kindle-fire-hdx-Roto2-300x120._V340341366_.jpg" style="margin-top: 5px;
                        border: 1px solid #CCC; width: 252px;" /><br />
                    <img src="../../Images/Temp/imgad.jpg" style="margin-top: 5px; border: 1px solid #CCC;
                        width: 252px;" /><br />
                </div>
            </div>
        </div>
    </div>
    <footer>
            <div class="content-wrapper">
                <div class="float-left">
                    <p>&copy; @DateTime.Now.Year - My ASP.NET MVC Application</p>
                </div>
            </div>
        </footer>
</div>
